// 定义header模块，依赖于jquery 面向对象 使用class 可以在模块中new，也可以在上级模块中new，需要return。
define(['request','template','cookie','jquery'], (request,template,cookie)=> {
    class Header{
        constructor(){                    
            this.loadHTML().then(()=>{
                // this.eventTarget()
                this.cookie()
                this.search()
                this.getTabs() 
            })                       
        }
        //头部html载入
        loadHTML(){
            return new Promise(resolve => {
                $('header').load('/html/modules/header.html',() =>{
                    resolve()
                })
            })            
        }
        //搜索跳转，并给网页附上Hash值
        search(){            
            $('#search').on('click',()=>{ 
                if($('.text').val()){
                    window.open( `/html/list.html#/${$('.text').val()}`,'_blank')
                }                 
            })            
            $(".text").keydown(function (e) {//当按下按键时
                if (e.which == 13) {//.which属性判断按下的是哪个键，回车键的键位序号为13
                    $('#search').trigger("click");//触发搜索按钮的点击事件
                }
            })
            $('.text').focus(function(){
                $('.search').css('border','1px solid gray')
            })
            $('.text').blur(function(){
                $('.search').css('border','none')
            })
        }
        //Nav数据加载
        getTabs(){
            request.getTabs().then(resp =>{
                this.data = resp.data
                const { list } = resp.data
                const html = template('shops-template',{list:list.slice(2,8)})
                $('#shops').html(html)
            })
        }
        //账号登录和注销
        cookie(){
            // 设置cookie            
            var username = $.cookie('username')
            if (username) {
            // 已登陆
            $('#userStatus li').eq(0).addClass('hide')
            $('#userStatus li').eq(1).addClass('hide')
            $('#userStatus li').eq(2).removeClass('hide')
            $('#userStatus li').eq(3).removeClass('hide')
            $('#userName').html(username)  //显示账号名
            }
            //注销账号
            $('#log-out').on('click',function(){
                if (confirm('确定要退出吗？')) {
                    $.cookie('username', '', { path: '/', expires: -1 })
                    $('#userStatus li').eq(3).addClass('hide')
                    $('#userStatus li').eq(2).addClass('hide')
                    $('#userStatus li').eq(1).removeClass('hide')
                    $('#userStatus li').eq(0).removeClass('hide')
                    $('#userName').html('')
                }
            })
        }
        
    }
    return new Header()
})